Позиционирование

Hoax · April 22, 2012

Почему не работает ? http://jsfiddle.net/

В основном не пашет вертикальное позиционирования, а тут оба (

Vin · April 22, 2012

А почему ссылка на главную страницу jsfiddle.net? ))

Hoax · April 22, 2012

http://jsfiddle.net/DnULn/

alexandr_v-vich · April 22, 2012

Hoax, http://htmlbook.ru/css/background-position

Hoax · April 22, 2012

я уже читал статью, сделал все как написано не получается сдвинуть как блок так и img

Viper · April 22, 2012

я уже читал статью, сделал все как написано не получается сдвинуть как блок так и img

Тоисть, ты прочитал статью по ссылке предоставленной выше, все понял! и продолжаешь пытаться изменять позицию блока с помощью background-position?

alexandr_v-vich · April 22, 2012

не получается сдвинуть как блок так и img

Какой img?

Странно, конечно, что вы читали… А ведь самое первое предложение звучит так

Задает начальное положение фонового изображения, установленного с помощью свойства background-image

Hoax · April 22, 2012

ну вот допустим

<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8">
  <title>background-position</title>
  <style>
  body {
background-image : url(hui.gif) ;
background-repeat: no-repeat;
background-position: center center;
   }
  </style>
 </head>
 <body>

 </body>
</html>

картина встает на место по горизонтали, а по вертикали -нет!

Catherine · April 22, 2012

А вот у меня почему-то все получается

background-position

задает положение фонового изображения, цвет же фона распространяется на весь элемент за вычетом margin'ов.

А в Вашем примере указан цвет фона (см. http://htmlbook.ru/css/background-color), но не указана картинка (см. http://htmlbook.ru/css/background-image), соответственно,

background-position

(см. http://htmlbook.ru/css/background-position) ни на что не влияет.

UPD: У меня есть совсем необоснованное предположение, что Вы хотите разместить фоновое изображение в бэграунде документа, но не указали высоту для body и html. Может в этом дело?

Edited April 22, 2012 by Catherine

alexandr_v-vich · April 22, 2012

Hoax, у вас не от чего center брать. Необходимо задавать height. Для вашего последнего примера нужно для html прописать height: 100%; (ну, к примеру)

Hoax · April 23, 2012

Понятно, а вот допустим, есть примерно такое код

<header>
<div id="kart"></div>
</header>

body {padding:0px;margin:0px;}
header {background:url(gr.gif)repeat-x;}
 #kart {background:url(foto.gif)center bottom repeat-x;height:300px;}

Так почему блок #kart как бы принимает положение с помощью позиционирования, ведь у родителя не стоит высота, или он опирается на свою высоту 300пикс. и прижимается?

Catherine · April 23, 2012

Понятно, а вот допустим, есть примерно такое код
<header>
<div id="kart"></div>
</header>
body {padding:0px;margin:0px;}
header {background:url(gr.gif)repeat-x;}
 #kart {background:url(foto.gif)center bottom repeat-x;height:300px;}
Так почему блок #kart как бы принимает положение с помощью позиционирования, ведь у родителя не стоит высота, или он опирается на свою высоту 300пикс. и прижимается?

У Вас в этом примере позиционирование для блоков не задано. Блок-родитель растягивается по высоте содержимого, конкретно в этом случае содержимое-это блок #kart. Почитайте про блочные элементы

Hoax · April 23, 2012

Catherine спс

Sign In

Позиционирование

Question

Link to comment

Share on other sites

12 answers to this question

Recommended Posts

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Join the conversation

Обсуждения

Important Information